.view-root {
	display: flex;
	flex-direction: column;
	height: 100vh;
	width: 100%;
	background-color: rgba(242, 246, 252, 1);
	.content-scroll {
		height: calc(100vh - 135rpx);
		.scroll-flex-wrap {
			display: flex;
			flex-direction: column;
			flex-wrap: nowrap;
			.swiper-box {
				width: 100vw;
				height: 540rpx;
				background: #ffffff;
				.banner-bannerImg {
					display: block;
					width: 100vw;
					height: 540rpx;
				}
			}
			.index-notice {
				height: 40rpx;
				background: #F2F6FC;
				border-radius: 20rpx;
				line-height: 40rpx;
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				color: #6B6970;
				padding: 0 24rpx;
				position: absolute;
				bottom: 16rpx;
				right: 24rpx;
			}
			.base-info {
				display: flex;
				flex-direction: column;
				margin: 24rpx 24rpx 0;
				border-radius: 24rpx;
				background-color: white;
				box-sizing: border-box;
				.price-line {
					display: flex;
					align-items: flex-end;
					margin: 24rpx;
					.current-price {
						color: rgba(252, 78, 76, 1);
						font-size: 32rpx;
						font-family: PingFangSC-Regular;
					}
					.old-price {
						color: rgba(176, 178, 177, 1);
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						text-decoration: line-through;
						flex: 1;
						margin-left: 16rpx;
					}
					> image {
						width: 36rpx;
						height: 36rpx;
					}
				}
				.name-line {
					display: flex;
					align-items: center;
					margin: 0 24rpx;
					box-sizing: border-box;
					.prescription-tag {
						height: 36rpx;
						line-height: 36rpx;
						background: #6E99C7;
						border-radius: 6rpx;
						padding: 4rpx 8rpx;
						font-size: 20rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						color: #FFFFFF;
						margin-right: 8rpx;
					}
					.medicine-name {
						flex: 1;
						font-size: 36rpx;
						font-family: PingFangSC-Semibold, PingFang SC;
						font-weight: 600;
						color: #222222;
					}
				}
				.medicine-abstract {
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					margin: 8rpx 24rpx 24rpx 24rpx;
					color: #B0B2B1;
				}
				.sub-base {
					background-color: rgba(250, 250, 250, 1);
					display: flex;
					box-sizing: border-box;
					align-items: center;
					padding: 20rpx 24rpx;
					border-bottom-right-radius: 24rpx;
					border-bottom-left-radius: 24rpx;
					>image {
						width: 36rpx;
						height: 36rpx;
					}
					>text {
						flex: 1;
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						color: #6B6970;
						margin-left: 8rpx;
					}
				}
			}
			.sale-info {
				display: flex;
				flex-direction: column;
				margin: 24rpx 24rpx 0;
				border-radius: 24rpx;
				background-color: white;
				box-sizing: border-box;
				
				.info-line {
					display: flex;
					padding: 24rpx;
					align-items: center;
				}
				
				.sub-sale {
					background-color: rgba(250, 250, 250, 1);
					display: flex;
					box-sizing: border-box;
					align-items: center;
					padding: 20rpx 24rpx;
					border-bottom-right-radius: 24rpx;
					border-bottom-left-radius: 24rpx;
					>image {
						width: 28rpx;
						height: 28rpx;
					}
					>text {
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						color: #222222;
						margin-left: 8rpx;
						margin-right: 36rpx;
					}
				}
			}
			.explain-info {
				display: flex;
				align-items: flex-start;
				padding: 24rpx;
				margin: 24rpx 24rpx 0;
				border-radius: 24rpx;
				background-color: white;
				box-sizing: border-box;
				.right-contents {
					width: 562rpx;
					align-items: center;
					display: flex;
					box-sizing: border-box;
					.center-content {
						width: 528rpx;
						display: flex;
						flex-direction: column;
						box-sizing: border-box;
					}
				}
			}
		}
	}
	.info-title {
		width: 92rpx;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		color: #6B6970;
	}
	.red-content {
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		color: rgba(252, 78, 76, 1);
	}
	.info-content {
		flex: 1;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		color: #222222;
	}
	.bottom-panel {
		width: 100vw;
		height: 135rpx;
		z-index: 400;
		background: #FFFFFF;
		box-shadow: 0rpx -4rpx 12rpx 0rpx #DFE5F3;
		border-radius: 24rpx 24rpx 0px 0px;
		display: flex;
		align-items: center;
		.img-btn {
			flex: 1;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			position: relative;
			>image {
				width: 44rpx;
				height: 44rpx;
			}
			>text {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				color: #6B6970;
			}
		}
		.cart-add-btn {
			width: 204rpx;
			height: 76rpx;
			background: #E0E9F3;
			border-radius: 38rpx;
			font-size: 28rpx;
			font-family: PingFangSC-Semibold, PingFang SC;
			font-weight: 600;
			color: #6E99C7;
			text-align: center;
			line-height: 76rpx;
			margin-right: 16rpx;
		}
		.purchase-btn {
			width: 204rpx;
			height: 76rpx;
			background: #6E99C7;
			border-radius: 38rpx;
			font-size: 28rpx;
			font-family: PingFangSC-Semibold, PingFang SC;
			font-weight: 600;
			color: white;
			text-align: center;
			line-height: 76rpx;
			margin-right: 24rpx;
		}
	}
	.explain-detail {
		width: 100%;
		height: 100vh;
		z-index: 900;
		background-color: rgba(0, 0, 0, 0.5);
		display: flex;
		flex-direction: column;
		position: fixed;
		.outer-area {
			flex: 1;
		}
		.explain-panel {
			background-color: white;
			padding: 24rpx;
			box-shadow: 0 -4rpx 12rpx 0 #DFE5F3;
			border-radius: 24rpx 24rpx 0px 0px;
			display: flex;
			flex-direction: column;
			align-items: stretch;
			.explain-title {
				font-size: 32rpx;
				font-family: PingFangSC-Semibold, PingFang SC;
				font-weight: 600;
				color: #333333;
				text-align: center;
			}
			.explain-notice {
				background: #F2F6FC;
				border-radius: 24rpx;
				padding: 24rpx;
				margin: 24rpx 0;
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				color: #222222;
			}
			.explain-line {
				display: flex;
				margin-bottom: 16rpx;
				.explain-line-head {
					width: 180rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					color: #B0B2B1;
				}
				.explain-line-content {
					flex: 1;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					color: #222222;
				}
			}
			.read-btn {
				width: 636rpx;
				height: 100rpx;
				background: #6E99C7;
				border-radius: 50rpx;
				font-size: 36rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				color: #FFFFFF;
				line-height: 100rpx;
				text-align: center;
				margin: 48rpx auto;
			}
		}
	}
	
	.qrcode-root {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 8888;
		background-color: rgba(0, 0, 0, 0.5);
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		.qrcode-dialog {
			background-color: #FFFFFF;
			border-radius: 24rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			padding: 24rpx;
			.poster-wrap {
				border-radius: 24rpx;
				box-shadow: 0rpx 2rpx 10rpx 0rpx rgba(0, 0, 0, 0.1);
				margin: 24rpx 0;
				box-sizing: border-box;
				display: flex;
			}
			.close-btn {
				width: 40rpx;
				height: 40rpx;
				align-self: flex-end;
			}
			.btn-line {
				display: flex;
				justify-content: space-around;
				align-items: center;
				.confirm-btn {
					width: 204rpx;
					height: 76rpx;
					background: #6E99C7;
					border-radius: 38rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: white;
					text-align: center;
					line-height: 76rpx;
					margin-right: 24rpx;
				}
			}
		}
		
	}
}

.single-line {
	word-break: break-all;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.cart-count {
	background-color: rgba(252, 78, 76, 1);
	color: white;
	position: absolute;
	top: 0;
	right: 40rpx;
	padding: 0 8rpx;
	font-size: 20rpx;
	height: 28rpx;
	line-height: 28rpx;
	border-radius: 14rpx;
}